<!-- 添加收件人组件 -->
<template>
	<div style="width: 100%;">
		<div>
			<!-- <van-nav-bar
          title="添加收件人"
          left-text="返回"
          left-arrow
          @click-left="onClickLeft"
        /> -->
			<!-- style="height: 100%;overflow: auto;box-sizing: border-box;" -->
			<uni-forms ref="form" :modelValue="fieldListParams" label-width="100px">
				<div class="client">
					<!-- right-icon="edit" -->
					<uni-forms-item :rules="[{ required: true, message: '请输入收件人' }]" required label="收件人：">
						<uni-easyinput v-model="fieldListParams.Addressee" placeholder="请输入收件人" />
					</uni-forms-item>
					<uni-forms-item :rules="[{ required: true, message: '请输入联系电话' }]" required label="联系电话：">
						<uni-easyinput v-model="fieldListParams.TelNumber" placeholder="请输入联系电话" />
					</uni-forms-item>
					<uni-forms-item :rules="[{ required: true, message: '请输入收件地址' }]" required label="收件地址">
						<uni-easyinput v-model="fieldListParams.Address" placeholder="请输入收件地址" />
					</uni-forms-item>
					<uni-forms-item label="备注">
						<uni-easyinput v-model="fieldListParams.Remark" placeholder="请输入备注" />
					</uni-forms-item>
				</div>
				<div class="submitButton" @click="onSubmit">
					<uni-button round block type="info" native-type="submit">保存收件人</uni-button>
				</div>
			</uni-forms>
		</div>
	</div>
</template>

<script>
	export default {
		components: {},
		data() {
			return {
				customStyle: {
					border: "2px solid blue"
				},
				// 是否显示弹窗
				show: false,
				// 添加收件人绑定数据
				fieldListParams: {
					// 收件人
					Addressee: "",
					// 联系电话
					TelNumber: "",
					// 收件地址
					Address: "",
					// 是否是默认地址
					IsDefault: 1,
					// 备注
					Remark: "",
					// 客户id
					CustomerId: ""
				}
			};
		},
		methods: {
			//返回
			onClickLeft() {
				this.show = false;
			},
			close() {
				this.show = false;
			},
			clear() {
				this.queryParam = [];
				this.getDataList();
			},
			// 保存收件人信息
			onSubmit() {

				// this.$set(this.entity, "Transactor", this.info.Id);
				// var entityData = { ...this.entity };
				// var SSAD_List = [...this.data];
				// entityData.SSAD_List = SSAD_List;

				this.http
					.post(
						"/CustomerManagement/Cust_AddressBook/SaveData",
						this.fieldListParams
					)
					.then(resJson => {
						console.log(resJson);

						if (resJson.Success) {
							Toast("添加成功");
							// 关闭添加收件人的弹窗
							this.show = false;
							console.log(this.$parent);
							// 调用父组件里的获取收件人信息列表
							this.$parent.contactPerson();
							// 返回样品列表页面
							this.$router.push({
								path: "/service/Edit",
								query: {
									readonly: 0
								}
							});
							// 数据初始化
							this.fieldListParams = {
								// 收件人
								Addressee: "",
								// 联系电话
								TelNumber: "",
								// 收件地址
								Address: "",
								// 是否是默认地址
								IsDefault: 1,
								// 备注
								Remark: "",
								// 客户id
								CustomerId: ""
							}
						} else {
							Toast(resJson.Msg);
						}
					});
			},

			getDataList() {
				//     this.http
				//       .post("/CustomerManagement/Customer/GetDataListByMoreCondition", {
				//         SortField: "Id",
				//         SortType: "asc",
				//         Search: this.queryParam,
				//         ...this.filters
				//       })
				//       .then(resJson => {
				//         this.data = resJson.Data;
				//         console.log(this.List);
				//       });
			},
			//   打开弹窗
			init() {
				this.show = true;
			},
			//   打开弹窗
			openForm() {
				this.init();
				//     this.getDataList();
			}
		}
	};
</script>

<style scoped>
	/* 覆盖van-button的默认样式 */
	.van-button {
		height: 35px !important;
		border-radius: 5px;
	}

	/* 适配底部导航栏 */
	.page-bottom {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		height: 65px;
		/*暂时发现安卓小屏手机安全区为0 && 不带单位的话padding-bottom会失效，写一个兜底, 并写在最上面；f12发现css样式如果都给height设置样式，会依次往下，用最底下的一个样式，如果最下面的没失效，依次往上查找，所以兜底的写在最上面 */
		height: calc(58px + constant(safe-area-inset-bottom));
		/* 直接扩展高度，因为padding-bottom是内边距 */
		height: calc(58px + env(safe-area-inset-bottom));
		/* 直接扩展高度 */
		background: #fff;
		padding: 10px 11px 0 20px;
		box-sizing: border-box;
		padding-bottom: constant(safe-area-inset-bottom);
		/*兼容 iOS<11.2 */
		padding-bottom: env(safe-area-inset-bottom);
		/* 兼容iOS>= 11.2*/
		text-align: right;
		border-top: 1px solid #e9e9e9;
	}

	.ckbxcli {
		border: 1px solid Gainsboro;
		/* width: 250px; */
		height: 150px;
		text-align: center;
		margin-left: 15px;
		margin-top: 15px;
		padding-right: 0px;
		padding-left: 0px;
		padding-bottom: 2px;
		cursor: pointer;
		padding-top: 6px;
		list-style-type: none;
		display: inline-block;
	}

	ul {
		margin-top: 20px;
	}

	.nav {
		position: fixed !important;
		width: 100%;
	}
</style>